<template>
    <div>
        <button v-for="(item,index) of cities" :key="index" @click="changeCity(item)">{{item}}</button>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                cities:["武汉","杭州","广州","厦门"]
            }
        },
        mounted() {
            console.log(this.$store.state.city)//city
        },
        methods: {
            changeCity(city){
                // console.log(city);
                this.$store.dispatch("changeCity",city)
                this.$router.push("/")
            }
        },
    }
</script>